<!DOCTYPE html>
<!-- 
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.3.5

License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
-->
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en">
    <!--<![endif]-->
    <!-- BEGIN HEAD -->

    <head>
        <meta charset="utf-8" />
        <title>
            <#if loginName??>
            ${loginName}
            <#else>
            居生活物业管理系统
            </#if>
        </title>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta content="width=device-width, initial-scale=1" name="viewport" />


        <link href="/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <link href="/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
        <link href="/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

        <link href="/plugins/metronic/css/components.min.css" rel="stylesheet" id="style_components" type="text/css" />

        <!-- BEGIN PAGE LEVEL STYLES -->
        <link href="/plugins/metronic/css/login-4.min.css" rel="stylesheet" type="text/css" />
        <link href="/plugins/bootstrap-toastr/toastr.min.css" rel="stylesheet" type="text/css" />
        <script src="/plugins/jquery.min.js"></script>
        <script type="text/javascript">


		</script>
         </head>
    <!-- END HEAD -->

    <body class=" login">
        <!-- BEGIN LOGO -->
        <div class="logo" style="margin-bottom: 0px">
            <#if loginName??>
                <#if loginLogo??>
                    <img src=${loginLogo}/>
                </#if>
                <h1 style="color: #39beff;font-family: Georgia;">${loginName}</h1>
            <#else>
                <img src=${loginLogo!"/pic/logo.png"} alt="" />
            </#if>
        </div>
        <!-- END LOGO -->
        <!-- BEGIN LOGIN -->
        <div class="content">
            <!-- BEGIN LOGIN FORM -->
            <form class="login-form form-horizontal" action="/LoginCtrl/login.x" method="post">
                <h3 class="form-title">用户登录</h3>
                <div class="alert alert-danger display-hide">
                    <button class="close" data-close="alert"></button>
                    <span> 请输入用户名和密码. </span>
                </div>
                <div class="form-group">
                    <!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
                    <label class="control-label visible-ie8 visible-ie9">用户名</label>
                    <div class="input-icon">
                        <i class="fa fa-user"></i>
                        <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="用户名" name="logName" id="logName"/>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label visible-ie8 visible-ie9">密码</label>
                    <div class="input-icon">
                        <i class="fa fa-lock"></i>
                        <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="密码" name="logPwd" />
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label visible-ie8 visible-ie9">验证码</label>
                    <div class="input-icon">
                        <i class="fa fa-th"></i>
                        <input class="form-control placeholder-no-fix pull-left"  type="text" autocomplete="off" placeholder="验证码" name="authCode" style="width: 60%"/>
                        <img class="form-control pull-right" src="/authImg" id="authImg" onclick="refresh()"  style="width: 35%;margin:0px;padding:0px">
                    </div>
                </div>

                <div class="form-actions">
                    <a href="javascript:;" id="forget-password"> 忘记密码? </a>
                    <button type="submit" class="btn green pull-right"> 登录 </button>
                </div>

            </form>
            <!-- END LOGIN FORM -->
            <!-- BEGIN FORGOT PASSWORD FORM -->
            <form class="forget-form">
                <h3>忘记密码 ?</h3>
                <p> 请输入邮箱来重置密码. </p>
                <div class="form-group">
                    <div class="input-icon">
                        <i class="fa fa-envelope"></i>
                        <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="Email" name="EmailAddr" id="EmailAddr"/> </div>
                </div>
                <div class="form-actions">
                    <button type="button" id="back-btn" class="btn red btn-outline">返回 </button>
                    <button type="button" class="btn green pull-right" onclick="veriyCode()"> 提交 </button>
                </div>
            </form>

            <form class="password-form" style="display:none">
                <h3>请输入验证码和新密码</h3>
                <p> 请从刚才的邮箱中找到验证码. </p>
                <div class="form-group">
                    <div class="input-icon">
                        <i class="fa fa-envelope"></i>
                        <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="验证码" name="verificationCode" id="verificationCode"/> </div>
                </div>
                <div class="form-group">
                    <div class="input-icon">
                        <i class="fa fa-envelope"></i>
                        <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="输入新密码" name="password" id="password"/> </div>
                </div>
                <div class="form-group">
                    <div class="input-icon">
                        <i class="fa fa-envelope"></i>
                        <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="第二次输入密码" id="nextPassword"/> </div>
                </div>
                <div class="form-actions">
                    <button type="button" id="back-btn2" class="btn red btn-outline" onclick="back()">返回 </button>
                    <button type="button" class="btn green pull-right" onclick="findPassword()"> 提交 </button>
                </div>
            </form>
		
        </div>
        
        <!-- END LOGIN -->
        <!-- BEGIN COPYRIGHT -->
        <#if loginName??>
        <#elseif loginLogo??>
        <#else>
            <div class="copyright">
                2018 (copy right) 居生活.
                <br>
                <a href="http://www.miitbeian.gov.cn">
                    粤ICP备16012265号-1
                </a>
            </div>
        </#if>
        <!-- END COPYRIGHT -->
 
        <script src="/plugins/respond.min.js"></script>

        <script src="/plugins/jquery.min.js" type="text/javascript"></script>
        <script src="/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>

        <script src="/plugins/jquery-validation/js/jquery.validate.min.js" type="text/javascript"></script>
        <script src="/plugins/jquery-validation/js/additional-methods.min.js" type="text/javascript"></script>

        <script src="/plugins/backstretch/jquery.backstretch.min.js" type="text/javascript"></script>
        <script src="/plugins/metronic/scripts/app.min.js" type="text/javascript"></script>
        <script src="/plugins/metronic/scripts/login-4.min.js" type="text/javascript"></script>
        <script src="/plugins/bootstrap-toastr/toastr.min.js" type="text/javascript"></script>
		<script type="text/javascript">
            //刷新验证码
            function refresh()
            {
                document.getElementById("authImg").src="/authImg?now="+new Date();//使用时间作为参数避免浏览器从缓存取图片
            }
            function reset()
            {
                document.getElementById("authImg").src="/authImg?now="+new Date();
                document.getElementByName("logName").value="";
                document.getElementByName("logPwd").value="";
                document.getElementByName("authCode").value="";
            }
            function submit()
            {
                alert("aaaaaa");
                //document.forms[0].submit();
            }

        	$(function(){
                if (window.top!=null && window.top.document.URL!=document.URL){
                    window.top.location= document.URL; //这样就可以让登陆窗口显示在整个窗口了
                }
        		var msg = "${message}";
        		if(msg != ''){
        			toastr.error(msg);
        		}
        			
        	});
        	
        	function veriyCode() {
                var email = $("#EmailAddr").val();
                var username = $("#logName").val()
                var params = {
                                username:username,
                                email:email
                             };
                $.post("/LoginCtrl/anon/verificationCode.x",$.param(params),function (data) {
                    if(data.ret_code == 1){
                        toastr.success("发送成功!");
                        $(".forget-form").hide();
                        $(".password-form").show();
                    }else{
                        toastr.error(data.data);
                    }
                },'json');
            }
        	
            function findPassword() {
                if($("#verificationCode").val()==''){
                    toastr.error("验证码不能为空!");
                    return;
                }

                if($("#password").val() != $("#nextPassword").val()){
                    toastr.error("两次密码不一致!");
                    return;
                }
                var params = {};
                params.username = $("#logName").val();
                params.email = $("#EmailAddr").val();
                params.verificationCode = $("#verificationCode").val();
                params.password = $("#password").val();

                $.post("/LoginCtrl/anon/findPassword.x",$.param(params),function (data) {
                    if(data.ret_code == 1){
                        toastr.success("密码修改成功");
                        $('.login-form').show();
                        $(".password-form").hide();
                    }else{
                        toastr.error(data.data);
                    }

                },'json');
            }

            function back() {
                window.history.back();
            }
        </script>
    </body>

</html>